<div class="editbox js-editbox" data-media-length={{mediaLength}}>
  <div class="scalebox js-scalebox">
    <a class="scale scale-default hidden" data-role="scale-default">
      <span class="line"></span>
      <span class="line line-dashed"></span>
      <span class="scale-time" data-role="scale-time"></span>
    </a>
    <a class="scale scale-blue hidden" data-role="scale-blue">
      <span class="line"></span>
      <div class="scale-details" >
        <ul class="lesson-list" data-role="scale-blue-list">
          <li class="item-lesson" id="" question-id="" data-role="scale-blue-item" data-toggle="modal" data-target=".modal">
            <span class="sqe-number"> <i class="question-remove es-icon es-icon-icon_close_circle" data-role="question-remove"></i>
              <span data-role="sqe-number">1</span>
            </span>
            <span class="title"> <i class="icon-drag glyphicon glyphicon-move"></i>
              <span class="color-primary text-xs" data-role="question-type"></span>
            </span>
            <span class="info text-overflow"  data-url="" data-role="question-info"></span>
          </li>
        </ul>
        <span class="time" data-role="scale-blue-time"></span>
      </div>
    </a>
    <a class="scale scale-red hidden" data-role="scale-red">
      <span class="line" ></span>
      <div class="scale-details" data-role="scale-red-details">00:00</div>
    </a>
    <a class="scale scale-white" style="left:20px;">
      <span class="line">
        <i class="es-icon es-icon-huakuai"></i>
      </span>
    </a>
  </div>
  <div class="scale-content">
    <ul class="lesson-list gruop-lesson-list" id="editbox-lesson-list"></ul>
  </div>
</div>
